import VueRouter from 'vue-router'
import Vue from 'vue'
import Home from '../components/Home.vue'
import About from '../components/About.vue'
import Message from '../pages/Message.vue'
import Detail from '../pages/Detail.vue'

Vue.use(VueRouter)

const route = [
    {
        path:'/home',
        component: Home,
        // beforeEnter(to,from,next){
        //     if(from.path === '/about/message'){
        //         next()
        //     }else{
        //         alert("401")
        //     }
        // }
    },
    {
        path:'/about',
        component: About,
        children:[
            {
                path:'message',
                component: Message,
                children:[
                    {
                        name:'detail',
                        path: 'detail/:id/:title',
                        component: Detail,
                        props: true
                    }
                ]
            }
        ]
    }
]

const router = new VueRouter({
    mode:'hash',
    routes:route
})

// 前置路由
// router.beforeEach((to, from, next) => {
//     console.log("to",to)
//     console.log("from",from)
//     next()
// })
// 后置路由
// router.afterEach((to,from) => {
//     console.log("to",to)
//     console.log("from",from)
// })

export default router